<template>
  <div class="container">
    <img :src="`${CDN}secondDetails/carInfo${carId}.jpg`" alt="">
    <div class="goBack" @click="goBack"></div>
    <div class="linkToAppoint" @click="linkToAppointPage"></div>
  </div>
</template>
<script>
import { imgUrls } from '@/views/index/imgUrls'
export default {
  data() {
    return {
      CDN: 'http://cntaipingapp.oss-cn-hangzhou.aliyuncs.com/oldage/img/taipingCar/',
      // 详情页对应的车的id
      carId: null,
      // 对应汽车信息页的index,总共6页汽车信息页， 0-5
      fromIndex: null,
      carTypeArr: [
          {id: 1, value: ['太享豪车','99997'], label: '2019款 凯迪拉克XT5 25T 豪华型'},
          {id: 2, value: ['太享豪车','1149485'], label: '2019款 沃尔沃XC60 T5 四驱智逸版'},
          {id: 3, value: ['太享豪车','1149749'], label: '2019款 沃尔沃S90 2.0T T5 智逸版'},
          {id: 4, value: ['太享豪车','1149750'], label: '2019款 沃尔沃S90 2.0T T5 智远版'},
          {id: 5, value: ['太享豪车','1156856'], label: '2019款 沃尔沃XC90(进口) 2.0T T5 智逸版 5座'},
          {id: 6, value: ['太享豪车','1156853'], label: '2019款 沃尔沃V90(进口) CC T5 AWD 智远版'},
          {id: 7, value: ['太享豪车','99995'], label: '中东2018款X5低配  3.0T'},
          {id: 8, value: ['太享豪车','99994'], label: '中东2018款X5高配  3.0T'},
          {id: 9, value: ['太享豪车','99993'], label: '18款欧规 柴油Q7 3.0T基本'},
          {id: 10, value: ['太享豪车','99992'], label: '18款霸道4000 VXR（18铝，9气，真皮，后挂）灰色'},
          {id: 11, value: ['太享豪车','99991'], label: '塞纳 19款3.5两驱XLE真皮7座号墨版'},
          {id: 12, value: ['太享豪车','99990'], label: '途乐Y62  19款4.0XE'},
          {id: 13, value: ['太享豪车','99989'], label: '帕杰罗V97  18款3.8五门GLS天窗双差'},
          {id: 14, value: ['太享豪车','99987'], label: '宝马525Li 2019款豪华套装'},
          // 新加一个
          {id: 50, value: ['太享豪车','1142216'], label: '2018款 揽胜运动版新能源(进口) P400e 白色'},
          // 新加5个 20190312
          {id: 53, value: ['太享豪车','100000'], label: '2018款 揽胜运动版新能源(进口) P400e 红色'},
          {id: 54, value: ['太享豪车','1133435'], label: '2018款 发现神行 240PS HSE版'},
          {id: 55, value: ['太享豪车','1169096'], label: '2019款 揽胜星脉(进口) 250PS'},
          {id: 56, value: ['太享豪车','1160313'], label: '2019款 捷豹XEL 2.0T 200PS 尊享版'},
          {id: 57, value: ['太享豪车','99985'], label: '2.0L 300PS AWD R-Sport 运动版'},
          {id: 15, value: ['石在舒适','2000006'], label: '2017款 速派 TSI280 DSG前行版'},
          {id: 16, value: ['石在舒适','1127996'], label: '2017款 帕萨特 280TSI DSG尊荣版'},
          {id: 17, value: ['石在舒适','1139063'], label: '2018款 凌渡 280TSI DSG舒适版'},
          {id: 18, value: ['石在舒适','192588'], label: '2017款 传祺GS8 320T 两驱豪华智联版'},
          {id: 19, value: ['石在舒适','1142079'], label: '2018款 昂科威 20T 两驱领先型'},
          {id: 20, value: ['石在舒适','1129262'], label: '2017款 自由光 2.0L 优越版'},
          {id: 21, value: ['石在舒适','1127075'], label: '2017款 凯迪拉克ATS-L 28T 时尚型'},
          {id: 22, value: ['石在舒适','1127076'], label: '2017款 凯迪拉克ATS-L 28T 技术型'},
          {id: 23, value: ['石在舒适','99996'], label: '2018款 天籁 2.0L 无级 XE时尚版'},
          {id: 24, value: ['石在舒适','1129041'], label: '2017款 科雷嘉 2.0L 两驱豪华版'},
          {id: 25, value: ['石在舒适','1126409'], label: '2017款 科雷傲 2.0L 两驱豪华版'},
          {id: 26, value: ['石在舒适','99999'], label: '2018款 威朗 三厢 15S 自动车享版'},
          {id: 27, value: ['石在舒适','99988'], label: '起亚K5 2016款 1.6T 双离合 LUX 全景天窗定制版'},
          {id: 28, value: ['石在舒适','1133099'], label: '2017款 君威 20T 尊贵型'},
          {id: 29, value: ['石在舒适','1134791'], label: '2018款 凯迪拉克XTS 28T 技术型'},
          {id: 30, value: ['石在舒适','1156935'], label: '2018款 凯迪拉克XT4 28T 两驱技术型'},
          {id: 31, value: ['石在舒适','1156936'], label: '2018款 凯迪拉克XT4 28T 两驱豪华型'},
          {id: 32, value: ['石在舒适','1156939'], label: '2018款 凯迪拉克XT4 28T 四驱领先运动型'},
          {id: 33, value: ['石在舒适','1151942'], label: '2019款 沃尔沃S60L T5 智远版'},
          {id: 34, value: ['石在舒适','1133053'], label: '2018款 沃尔沃S60L 1.5T T3 智进版'},
          {id: 35, value: ['石在舒适','1160347'], label: '2019款 沃尔沃V40(进口) T3 智逸版'},
          {id: 36, value: ['石在舒适','1141938'], label: '2018款 Espace(进口) TCe 300 旷逸版'},
          {id: 37, value: ['石在舒适','1141939'], label: '2018款 Espace(进口) TCe 300 舒逸版'},
          {id: 38, value: ['石在舒适','1133365'], label: '2018款 马自达CX-4 2.0L 自动两驱蓝天活力版'},
          // 新加两个
          {id: 51, value: ['石在舒适','1142078'], label: '2018款 昂科威 20T 两驱精英型'},
          {id: 52, value: ['石在舒适','1156937'], label: '2018款 凯迪拉克XT4 28T 两驱豪华运动型'},
          {id: 39, value: ['惠选经济','1133565'], label: '2018款 明锐 1.6L 手动标准版'},
          {id: 40, value: ['惠选经济','32450'], label: '2016款 桑塔纳 1.6L 自动 风尚版'},
          {id: 41, value: ['惠选经济','1133723'], label: '2017款 传祺GS7 280T 两驱豪华型'},
          {id: 42, value: ['惠选经济','1133686'], label: '2017款 传祺GS3 200T 自动精英版'},
          {id: 43, value: ['惠选经济','1160153'], label: '2018款 传祺GS4 235T 自动两驱豪华智联百万纪念版'},
          {id: 44, value: ['惠选经济','1160152'], label: '2018款 传祺GS4 235T 自动两驱精英百万纪念版'},
          {id: 45, value: ['惠选经济','1128357'], label: '2017款 MGZS 1.5L 自动豪华版'},
          {id: 46, value: ['惠选经济','1160133'], label: '2019款 轩逸 1.6XV CVT智联尊享版 国V'},
          {id: 47, value: ['惠选经济','99998'], label: '2018款 MG6 20T 自动豪华智联版'},
          {id: 48, value: ['惠选经济','1134381'], label: '2018款 英朗 15T 双离合精英型'},
          {id: 49, value: ['惠选经济','1128129'], label: '2017款 朗逸 1.6L 自动舒适版'}
      ],
      carType: null,
      audioHide: null,
      sec: null
    }
  },
  created() {
    this.carId = this.$route.query.carId - 0
    this.audioHide = this.$route.query.audioHide
    this.sec = this.$route.query.sec
    if(this.sec == 1) {
      this.audioHide = false
    }
    this.getCarInfoActive()
    this.getCarNo()
  },
  methods: {
    getCarNo() {
      const t = this.carTypeArr.find(e => {
        return e.id == this.carId
      })
      this.carType = t.value
      // const idx = this.carIdArr.findIndex(e =>{
      //   return e == this.carId
      // })
      // this.carType = this.carTypeArr[this.carId - 1]  // 减1，this.carId不是从0开始
      // console.log(this.carType)
    },
    getCarInfoActive() {
      let carIdArr = []
      imgUrls.forEach(e => {
        carIdArr.push(e.childrenId)
      })
      carIdArr.forEach((e, i) => {
        if(e.includes(this.carId)) {
          this.fromIndex = i
        }
      })
      // console.log(this.fromIndex)
    },
    /**
     * 点“我要申请”前往申请表单那一屏，往路由上传一个“appointActive”参数
     */
    linkToAppointPage() {
      this.$router.push({
        path: '/',
        query: {
          appointActive: 1,
          carType: this.carType,
          audioHide: this.audioHide,
        }
      })
    },
    /**
     * 返回的处理
     */
    goBack() {
      this.$router.push({
        path: '/',
        query: {
          fromIndex: this.fromIndex + '',
          audioHide: this.audioHide,
        } 
      })
    }
  }
}
</script>
<style lang="stylus" scoped>
.container
  position relative
  .linkToAppoint
    width 1.23rem /* 123/100 */
    height .34rem /* 34/100 */
    position absolute
    bottom .45rem /* 45/100 */
    left 2.64rem /* 264/100 */
    // background-color red
  .goBack
    width .75rem /* 75/100 */
    height .7rem /* 70/100 */
    position absolute
    right 0
    top 0
    // background-color green
</style>
